<template>
	<div id="conten">
		<div class="ABox">
			<div class="title">
				<span class="ywColor">业务机（{{ywjIp}}）
						<nodeStatus  :nodeIp="ywjIp"></nodeStatus>
				</span>
				<div class="infoDiv" :class="driveInfo != '驱动信息加载中...'?'warning':''" v-show="driveInfo">{{driveInfo}}</div>
			</div>
				
				<el-scrollbar ref="scrollbarA" style="height: 310px" wrap-class="list" wrap-style="overflow-x:hidden;" > 
					<ul style="margin:20px 10px">
						<li  v-for="(item,i) in ywjA" :key="i" style="margin-bottom:16px">{{item}}</li>
					</ul>
				</el-scrollbar>

			 <div class="cenBOx">
				<el-button size="mini" type="primary" plain class="" @click="firing('ywj')">启动</el-button>
			 	<el-button size="mini" type="primary" plain class="ml10" @click="restart('ywj')">重启</el-button>
			 	<el-button size="mini" type="danger" plain class="ml10" @click="stopdata('ywj')">停止</el-button>
			 </div>  
		</div>
		<div class="BBox">
			<div class="title">
				<span class="bzColor">保障机（{{bzjIp}}）
						<nodeStatus  :nodeIp="bzjIp"></nodeStatus>
				</span>
				
				<div class="infoDiv" :class="driveInfo != '驱动信息加载中...'?'warning':''" v-show="driveInfo">{{driveInfo}}</div>

			</div>  
			
			<el-scrollbar ref="scrollbarB" style="height: 310px" wrap-class="list" wrap-style="overflow-x:hidden;" > 
				<ul style="margin:20px 10px">
					<li  v-for="(item,i) in bzjB" :key="i" style="margin-bottom:16px">{{item}}</li>
				</ul>
			</el-scrollbar>	
				
			<div class="cenBOx">
				<el-button size="mini" type="primary" plain class="" @click="firing('bzj')">启动</el-button>
			 	<el-button size="mini" type="primary" plain class="ml10" @click="restart('bzj')">重启</el-button>
			 	<el-button size="mini" type="danger" plain class="ml10" @click="stopdata('bzj')">停止</el-button>
			 </div>  
		</div>
	</div>
</template>

<script>
	import {
		setGroupNodeNioWorkMode,
		cleanGroupNodeNioQueue,
		groupDriverStatus,
		groupDriverRestart,
		groupDriverStop,
		groupDriverStart
	} from "@/api/console/senior";
	//节点状态显示组件
	import nodeStatus from '@/views/components/simple/nodeStatus';
		
		export default {
			components: {
				nodeStatus,
			},
		data() {
			return {
				options: [],
				value: '',
				groupId:'',
				ywjId:'',
				bzjId:'',
				ywjIp:'',
				bzjIp:'',
				ywjA:'',
				bzjB:'',
				ywjData:{
					id:'',
					ip:'',
					pattern:'',
					writedata:'',
					returndata:'',
					queue:'',
				},
				bzjData:{
					id:'',
					ip:'',
					pattern:'',
					writedata:'',
					returndata:'',
					queue:'',
				},
				item:'',
				setHandleMonitorTimeout:'',
				driveInfo:'',
				
			};
		},
		mounted(){
			
			//保障分组-系统状态		
			this.getDicts('group_node_nio_status').then(response => {
				
				if(response.data){
					this.options = response.data;
				}else{
					this.$message({
						message: '获取队列失败',
						type: 'error'
					});
				}
			})
		},
		methods: {
      groupDriverStatusFn(item) {
					this.getGroupDriverStatusFn(item)
					if (this.setHandleMonitorTimeout) {
						clearInterval(this.setHandleMonitorTimeout)
					}
					this.setHandleMonitorTimeout = setInterval(() => {
						this.getGroupDriverStatusFn(item)
					},5000)
			},
			getGroupDriverStatusFn(item,type,fnType){
				this.item = item
				this.ywjId = item.importantNodeId
				this.bzjId = item.securityNodeId
				this.ywjIp = item.importantNodeIp
				this.bzjIp = item.securityNodeIp
				
				
				groupDriverStatus({'id':item.id,nodeId:item.importantNodeId}).then(response=>{
					
					if(JSON.stringify(response.data) == '{}'){
						this.ywjA = '';
						this.driveInfo =  '业务机驱动信息获取为空';
					}else{
						this.driveInfo =  '';
					}
					
					this.setData(response);
				})
				
				
				groupDriverStatus({'id':item.id,nodeId:item.securityNodeId}).then(response=>{
					
					if(JSON.stringify(response.data) == '{}'){
						this.bzjB = '';
						this.driveInfo =  '保障机驱动信息获取为空';
					}else{
						this.driveInfo =  '';
					}
					
					
					 this.setData(response,type,fnType);
					
				})
				
				
			},
			//设置数据
			setData(response,type,fnType){
				var vue = this
				for (var key in response.data) {
					if (key === vue.ywjId) {
						vue.ywjA = response.data[key]
					}
					if (key === vue.bzjId) {
						vue.bzjB = response.data[key]
					}
				}
				
				var nodeData = [];
				if(type == 'ywj'){
					nodeData = vue.ywjA;
				}else if(type == 'bzj'){
					nodeData = vue.bzjB;
				}		
				
				if(!fnType)return
				switch(fnType) {
							case 'start':
								if(nodeData[0] && nodeData[0] == '驱动状态：运行中'){
									this.$message({
										message: '启动成功',
										type: 'success'
									})
								}else{
									this.$message({
										message: '启动失败',
										type: 'error'
									})
								}
								break;
							case 'resStart':
								if(nodeData[0] && nodeData[0] == '驱动状态：运行中'){
									this.$message({
										message: '重启成功',
										type: 'success'
									})
								}else{
									this.$message({
										message: '重启失败',
										type: 'error'
									})
								}
								break;
							case 'stop':
								if(nodeData[0] && nodeData[0] == '驱动状态：停止'){
									this.$message({
										message: '停止成功',
										type: 'success'
									})
								}else{
									this.$message({
										message: '停止失败',
										type: 'error'
									})
								}
								break;	
						default:
						
				}
			},
			// 启动
			firing(type) {
				var searchId = ''
				if (type == 'ywj') {
					searchId = this.ywjId
				}
				if (type == 'bzj') {
					searchId = this.bzjId
				}
				groupDriverStart({searchId:searchId}).then(response=>{
					if (response.data) {
						this.$message({
							message: '启动命令执行中...',
							type: 'info'
						})
						setTimeout(() => {
							this.getGroupDriverStatusFn(this.item,type,'start')
						}, 5000);
					} else {
						this.$message({
							message: '启动失败',
							type: 'error'
						})						
					}
				})
			},
			// 启动
			restart(type) {
				var searchId = ''
				if (type == 'ywj') {
					searchId = this.ywjId
				}
				if (type == 'bzj') {
					searchId = this.bzjId
				}
				groupDriverRestart({searchId:searchId}).then(response=>{
					if (response.data) {
						this.$message({
							message: '重启命令执行中...',
							type: 'info'
						})
						setTimeout(() => {
							this.getGroupDriverStatusFn(this.item,type,'resStart')
						}, 5000);
					} else {
						this.$message({
							message: '重启失败',
							type: 'error'
						})						
					}
				})
			},
			// 停止
			stopdata(type) {
				var searchId = ''
				if (type == 'ywj') {
					searchId = this.ywjId
				}
				if (type == 'bzj') {
					searchId = this.bzjId
				}
				groupDriverStop({searchId:searchId}).then(response=>{
					if(response.data){
						this.$message({
							message: '停止命令执行中...',
							type: 'info'
						})
						 setTimeout(() => {
	             this.getGroupDriverStatusFn(this.item,type,'stop')
							}, 5000);
					}else{
						this.$message({
							message: '停止失败',
							type: 'error'
						});
					}
				})
			},
			//设置模式   参数：{searchId：节点ID，groupStatus：模式  1、2、3、4}
			setGroupNodeNioWorkModeFn(type){
				var  formData = {};
				if(type == 'ywj'){
					formData.searchId = this.ywjData.id;
					formData.groupStatus = Number(this.ywjData.pattern);
				}else if(type == 'bzj'){
					formData.searchId = this.bzjData.id;
					formData.groupStatus = Number(this.bzjData.pattern);
				}
				
				setGroupNodeNioWorkMode(formData).then(response => {
					if(response.data){
						this.msgSuccess("模式设置成功");
					}else{
						this.$message({
							message: '模式设置失败',
							type: 'error'
						});
					}
				})
				
			},
			//清除队列 参数：{searchId ：节点ID}
			cleanGroupNodeNioQueueFn(type){
				var  formData = {};
				if(type == 'ywj'){
					formData.searchId = this.ywjData.id;
				}else if(type == 'bzj'){
					formData.searchId = this.bzjData.id;
				}
				
				cleanGroupNodeNioQueue(formData).then(response => {
					if(response.data){
						this.msgSuccess("清除队列 成功");
					}else{
						this.$message({
							message: '清除队列 失败',
							type: 'error'
						});
					}
				})
			},
			
		}	
	}
</script>

<style scoped="scoped">
	#conten{
		display: flex;
		justify-content: space-between;
	}
	
	#conten > div{
		width: 430px;
		height: auto;
		border: 1px solid #e3e3e3;
		border-radius: 4px;
		padding: 10px;
	}
	
	
	.infoDiv{
		
    margin-top: 50px;
	}
	
	.warning{
		color: #d49010;
	}
	.title{
		text-align: center;
		padding: 10px;
		font-size: 16px;
	}	
	

	.ywColor{
		color: #67c23a;
	}
	
	.bzColor{
		color:#1890ff
	}
	.ml10{
		margin-left: 10px;
	}
	.cenBOx{
		margin-top: 50px;
		margin-bottom:10px;
		margin-left: 26%;
	}
	
	.leftBox{
		display: inline-block;
		width: 110px;
		padding: 0 18px;
		text-align: right;
	}	
	.rightSpan{
		display: inline-block;
		width: 200px;
	}
</style>
<style>
ul li {
	list-style: none;
}
ul,li{
	margin:0;
	padding:0;
} 
</style>
